import 'package:extended_image/extended_image.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'AboutPage.dart';
import 'LoginPage.dart';
import 'MsgPage.dart';
import 'OrderPage.dart';

final List<String> titles = ["待审核", "待发货", "待收货", "待归还"];
final List<String> icons = ["shenhe", "fahuo", "shouhuo", "guihuan"];

class MinePage extends StatefulWidget {
  const MinePage({Key? key}) : super(key: key);

  @override
  State<MinePage> createState() => _MinePageState();
}

class _MinePageState extends State<MinePage> {
  bool _isLogin = false;

  @override
  void initState() {
    super.initState();

    SharedPreferences.getInstance().then((value) {
      setState(() {
        _isLogin = value.getBool("login") ?? false;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    double width = Get.width;
    return Scaffold(
      body: Stack(
        children: [
          SizedBox(
            width: width,
            height: width * 0.6,
            child: Stack(
              children: [
                ConstrainedBox(
                    constraints: const BoxConstraints.expand(),
                    child: Image.asset(
                      "images/topbg.png",
                      fit: BoxFit.cover,
                    )),
                Container(
                  decoration: BoxDecoration(
                      gradient: LinearGradient(colors: [
                        const Color(0xFFFF8343).withOpacity(0.8),
                        const Color(0xFFFF6C72).withOpacity(0.8)
                      ])),
                )
              ],
            ),
          ),
          SafeArea(
              child: Padding(
                padding: const EdgeInsets.symmetric(horizontal: 15),
                child: Column(
                  children: [
                    const SizedBox(
                      height: 30,
                    ),
                    InkWell(
                      onTap: _showLogin,
                      child: Row(
                        children: [
                          Container(
                            width: 68,
                            height: 68,
                            alignment: Alignment.center,
                            decoration: BoxDecoration(
                                border: Border.all(color: Colors.white70, width: 2),
                                shape: BoxShape.circle),
                            child: _isLogin
                                ? ClipRRect(
                              borderRadius: BorderRadius.circular(25),
                              child: ExtendedImage.network(
                                "http://cdn.wfhero.online/device/avatar.png",
                                width: 55,
                                height: 55,
                                fit: BoxFit.cover,
                              ),
                            )
                                : ClipRRect(
                              child: Image.asset(
                                "images/portait.png",
                                width: 50,
                                height: 50,
                              ),
                            ),
                          ),
                          const SizedBox(
                            width: 10,
                          ),
                          Text(
                            _isLogin ? "咖啡不加糖" : "请登录/注册",
                            style: const TextStyle(
                                color: Colors.black,
                                fontWeight: FontWeight.w600,
                                fontSize: 16),
                          )
                        ],
                      ),
                    ),
                    const SizedBox(
                      height: 20,
                    ),
                    _orderWidget(),
                    const SizedBox(
                      height: 15,
                    ),
                    _infoWidget(),
                    const Spacer(),
                    _isLogin
                        ? InkWell(
                      onTap: () {
                        SharedPreferences.getInstance().then((value) {
                          value.setBool("login", false);
                          setState(() {
                            _isLogin = false;
                          });
                        });
                      },
                      child: Container(
                        height: 50,
                        alignment: Alignment.center,
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(25),
                            gradient: const LinearGradient(
                                colors: [
                                  Color(0xFFED7F18),
                                  Color(0xFFFFC48C)
                                ],
                                begin: Alignment.topLeft,
                                end: Alignment.bottomRight)),
                        child: const Text(
                          "退出登录",
                          style: TextStyle(color: Colors.white),
                        ),
                      ),
                    )
                        : const SizedBox(),
                    const SizedBox(
                      height: 30,
                    ),
                  ],
                ),
              ))
        ],
      ),
    );
  }

  Widget _infoWidget() {
    return Container(
      decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(15), color: Colors.white),
      child: Column(
        children: [
          _infoItemWidget(
              title: "消息",
              icon: "ic_msg",
              callback: () {
                if (!_isLogin) {
                  _showLogin();
                } else {
                  Get.to(() => MsgPage());
                }
              }),
          _infoItemWidget(
              title: "关于APP",
              icon: "ic_about",
              callback: () {
                Get.to(() => AboutPage());
              })
        ],
      ),
    );
  }

  Widget _infoItemWidget(
      {required String title,
        required String icon,
        required VoidCallback callback}) {
    return InkWell(
      onTap: () {
        callback();
      },
      child: Container(
        height: 50,
        decoration: BoxDecoration(
            border: Border(bottom: BorderSide(color: Colors.grey.shade50))),
        padding: const EdgeInsets.symmetric(horizontal: 15),
        child: Row(
          children: [
            Image.asset(
              "images/$icon.png",
              width: 23,
            ),
            const SizedBox(
              width: 10,
            ),
            Text(title),
            const Spacer(),
            const Icon(Icons.arrow_right)
          ],
        ),
      ),
    );
  }

  void _showLogin() {
    showLoginPage(context).then((value) {
      if (value != null) {
        setState(() {
          _isLogin = true;
        });
      }
    });
  }

  Widget _orderWidget() {
    return Container(
      height: 120,
      decoration: BoxDecoration(
          color: Colors.white,
          boxShadow: [BoxShadow(color: Colors.grey.shade200, blurRadius: 5)],
          borderRadius: BorderRadius.circular(15)),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const SizedBox(
            height: 15,
          ),
          const Padding(
            padding: EdgeInsets.only(left: 15.0),
            child: Text(
              "我的订单",
              style: TextStyle(fontWeight: FontWeight.w600),
            ),
          ),
          const SizedBox(
            height: 10,
          ),
          Expanded(
            child: Row(
              children: [
                for (int i = 0; i < titles.length; i++) _itemWidget(i)
              ],
            ),
          )
        ],
      ),
    );
  }

  Widget _itemWidget(int index) {
    return Expanded(
      child: InkWell(
        onTap: () {
          if (!_isLogin) {
            _showLogin();
          } else {
            Get.to(() => OrderPage(index));
          }
        },
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            Image.asset(
              "images/${icons[index]}.png",
              width: 25,
            ),
            Text(titles[index])
          ],
        ),
      ),
    );
  }
}
